<ul class="accordion-menu">
    {% for key,value in menu %}
        {% if key == '' %}
            {% for item in value %}
            <li>
                <a href="{{ path(item.route) }}"><i class="menu-icon {{ item.iconName }}"></i><span>{{ item.routeName }}</span></a>
            </li>
            {% endfor %}
        {% else %}
            <li>
                <a href="#">
                    <i class="menu-icon {{ value[0].iconName }}"></i><span>{{ key }}</span><i class="accordion-icon fa fa-angle-left"></i>
                </a>
                <ul class="sub-menu">
                    {% for item in value %}
                        <li><a href="{{ path(item.route) }}">{{ item.routeName }}</a></li>
                    {% endfor %}
                </ul>
            </li>
        {% endif %}
    {% endfor %}
</ul>
<script>
    $(function (){
        let focus = window.location.pathname;
        Tools.ajax({
            url: '{{ path(constant_route("MENU_FOCUS")) }}',
            data: {focus},
            async: false,
            success: function (res) {
                focus = res.focus;
            }
        });
        if(focus === ""){
            focus = '{{ path(constant_route('HOME')) }}';
        }
        let activeMenu = $('.accordion-menu a[href="' + focus + '"]');
        let subMenu = activeMenu.parent().parent();
        if(!subMenu.hasClass('accordion-menu')){
            activeMenu.addClass('active');
            subMenu.show().find('> li').addClass('animation');
            subMenu.parent().addClass("active-page").addClass("open");
        }else{
            activeMenu.parent().addClass('active-page');
        }
    });
</script>